// 导入新的 SASS API 使用声明
@use "sass:math";
@use "sass:color";
@use "sass:list";
@use "sass:map";
@use "sass:string";

// 导入变量（使用相对路径）
@use "./variables" as *;

// 这个文件会被 Vue CLI 自动注入到每个组件的 SCSS 中
// 可以在这里添加全局样式或函数

// 以下是一些常用的辅助函数
@function rem($px) {
  @return math.div($px, 16px) * 1rem;
}

@function em($px, $base: 16px) {
  @return math.div($px, $base) * 1em;
}

// 常用样式重置
html, body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

// 去除列表样式
ul, ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

// 通用样式类
.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.flex-center {
  @include flex-center;
}

.ellipsis {
  @include ellipsis;
}

// 隐藏滚动条但保持滚动功能
.hide-scrollbar {
  -ms-overflow-style: none;  /* IE 和 Edge */
  scrollbar-width: none;  /* Firefox */
  
  &::-webkit-scrollbar {
    display: none;  /* Chrome, Safari 和 Opera */
  }
} 